import './styles/tailwind.css';
import { createApp } from 'vue';
import { setupNaiveDiscreteApi, setupNaive, setupDirectives } from '@/plugins';
import App from './App.vue';
import router, { setupRouter } from './router';
import { setupStore } from '@/store';

/** 文件上传组件 */
import uploader from 'vue-simple-uploader';
import 'vue-simple-uploader/dist/style.css';

/** 图片预览组件 */
import 'viewerjs/dist/viewer.css';
import VueViewer from 'v-viewer';

/** v-md-editor 组件 */
import VMdEditor from '@kangc/v-md-editor/lib/codemirror-editor';
import '@kangc/v-md-editor/lib/style/codemirror-editor.css';
import githubTheme from '@kangc/v-md-editor/lib/theme/github.js';
import '@kangc/v-md-editor/lib/theme/style/github.css';

// ---------- highlightjs(这是显示预览的代码高亮)
import hljs from 'highlight.js/lib/core';
// 按需引入语言包
import c from 'highlight.js/lib/languages/c';
import java from 'highlight.js/lib/languages/java';
import javascript from 'highlight.js/lib/languages/javascript';
// 注册代码高亮
hljs.registerLanguage('c', c)
hljs.registerLanguage('java', java)
hljs.registerLanguage('javascript', javascript)

// -------- codemirror 编辑器的相关资源(左侧markdown编辑器的配置)
import Codemirror from 'codemirror';
// mode (代码高亮)
import 'codemirror/mode/markdown/markdown';
// edit
import 'codemirror/addon/edit/closebrackets';
import 'codemirror/addon/edit/closetag';
import 'codemirror/addon/edit/matchbrackets';
// placeholder
import 'codemirror/addon/display/placeholder';
// active-line
import 'codemirror/addon/selection/active-line';
// scrollbar
import 'codemirror/addon/scroll/simplescrollbars';
import 'codemirror/addon/scroll/simplescrollbars.css';
// style
import 'codemirror/lib/codemirror.css';

// --------------------- 插件
// emoji
import createEmojiPlugin from '@kangc/v-md-editor/lib/plugins/emoji/index';
import '@kangc/v-md-editor/lib/plugins/emoji/emoji.css';
/*// katex 插件
import createKatexPlugin from '@kangc/v-md-editor/lib/plugins/katex/cdn';
// mermaid
import createMermaidPlugin from '@kangc/v-md-editor/lib/plugins/mermaid/cdn';
import '@kangc/v-md-editor/lib/plugins/mermaid/mermaid.css';*/
// to do list
import createTodoListPlugin from '@kangc/v-md-editor/lib/plugins/todo-list/index';
import '@kangc/v-md-editor/lib/plugins/todo-list/todo-list.css';
// 代码行号
import createLineNumbertPlugin from '@kangc/v-md-editor/lib/plugins/line-number/index';
// 代码快捷复制
import createCopyCodePlugin from '@kangc/v-md-editor/lib/plugins/copy-code/index';
import '@kangc/v-md-editor/lib/plugins/copy-code/copy-code.css';

VMdEditor.Codemirror = Codemirror;
VMdEditor.use(githubTheme, {
  Hljs: hljs,
}).use(createEmojiPlugin())
  /*.use(createKatexPlugin())
  .use(createMermaidPlugin())*/
  .use(createTodoListPlugin())
  .use(createLineNumbertPlugin())
  .use(createCopyCodePlugin());

async function bootstrap() {
  const app = createApp(App);

  // 挂载状态管理
  setupStore(app);

  // 注册全局常用的 naive-ui 组件
  setupNaive(app);

  // 挂载 naive-ui 脱离上下文的 Api
  setupNaiveDiscreteApi();

  // 注册全局自定义组件
  //setupCustomComponents();

  // 注册全局自定义指令，如：v-permission权限指令
  setupDirectives(app);

  // 注册全局方法，如：app.config.globalProperties.$message = message
  //setupGlobalMethods(app);

  // 挂载路由
  setupRouter(app);

  // 路由准备就绪后挂载 APP 实例
  // https://router.vuejs.org/api/interfaces/router.html#isready
  await router.isReady();

  // 挂载文件上传组件
  app.use(uploader);

  // 挂载 v-md-editor 组件
  app.use(VMdEditor);

  // 挂载图片预览组件
  app.use(VueViewer)

  app.mount('#app', true);
}

void bootstrap();
